<?php
	/*
		Template Name: Slider Page
	*/
?>	
<?php get_header(); the_post();?>
	
    	
<script src="./js/js-image-slider.js" type="text/javascript"></script>
<link href="./js-image-slider.css" rel="stylesheet" type="text/css" />

<div id="sliderFrame">
        <div id="ribbon"></div>
        <div id="slider">
		<?php 

		$imgData = get_post_meta($post->ID, 'image', true); 

		$indDataArr = explode("|", $imgData);

		foreach ($indDataArr as $indData) {
			$imgDat = wp_get_attachment_image_src($indData);
			echo "<img src='$imgDat[0]'  />";
		}

		?>
            <a href="http://www.menucool.com/jquery-slider" target="_blank">
                <img src="img/image-slider-1.jpg" alt="Welcome to Menucool.com" />
            </a>
            <img src="img/image-slider-2.jpg" alt="" />
            <img src="img/image-slider-3.jpg" alt="Pure Javascript. No jQuery. No flash." />
            <img src="img/image-slider-4.jpg" alt="#htmlcaption" />
            <img src="img/image-slider-5.jpg" />
        </div>
        <div id="htmlcaption" style="display: none;">
            <em>HTML</em> caption. Link to <a href="http://www.google.com/">Google</a>.
        </div>
    </div>

<?php get_sidebar(); ?>

<?php get_footer(); ?>
